/*
 * @Author: Youjiang Xie
 * @Date:   2019-11-03 11:56:57
 * @Last Modified by:   YouJiang Xie
 * @Last Modified time: 2019-11-03 23:33:19
 * @E-mail:xie_youjiang@163.com
 */

layui.define(['jquery', 'layer'], function(exports) {
	let $ = layui.jquery;
	let layer = layui.layer;

	let mapControl = {
		init: function() {
			this.onLoad();
			this.bindEvent();
		},

		onLoad: function() {
			this.loadMap();
		},

		bindEvent: function() {

		},

		loadMap: function() {
			var pts = wgs2bd(30.656817, 104.074631);
			var center = new BMap.Point(pts[1], pts[0]);
			//var center = new BMap.Point(117.7329972 + 0.01115, 38.972775 + 0.007);
			map = new BMap.Map("map", {
				enableMapClick: false
			});
			map.centerAndZoom(center, 14);
			map.enableDragging();
			map.enableInertialDragging();
			map.enableScrollWheelZoom();
			map.enableDoubleClickZoom();
			map.enableKeyboard();
			map.enableContinuousZoom();
			var ctrl_type = new BMap.MapTypeControl({
				mapTypes: [BMAP_NORMAL_MAP, BMAP_SATELLITE_MAP,
					BMAP_HYBRID_MAP
				],
				anchor: BMAP_ANCHOR_TOP_LEFT,
				offset: new BMap.Size(20, 20)
			});
			map.addControl(ctrl_type);
			//this.loadPipe();
			this.loadMonitorPoint();
		},

		loadPipe: function() {
			var _this = this;
			$.getJSON("./static/pipeline/DN150.json", "", function(data) {
				if (data != null && data.features != null) {
					_this.drawLines(data.features, "#8bb209", 1);
				}
			});
			$.getJSON("./static/pipeline/DN200.json", "", function(data) {
				if (data != null && data.features != null) {
					_this.drawLines(data.features, "#8bb209", 2);
				}
			});
			$.getJSON("./static/pipeline/DN300.json", "", function(data) {
				if (data != null && data.features != null) {
					_this.drawLines(data.features, "#8bb209", 3);
				}
			});
			$.getJSON("./static/pipeline/DN350.json", "", function(data) {
				if (data != null && data.features != null) {
					_this.drawLines(data.features, "#8bb209", 3);
				}
			});
			$.getJSON("./static/pipeline/DN400.json", "", function(data) {
				if (data != null && data.features != null) {
					_this.drawLines(data.features, "#8bb209", 3);
				}
			});
			$.getJSON("./static/pipeline/DN500.json", "", function(data) {
				if (data != null && data.features != null) {
					_this.drawLines(data.features, "#8bb209", 4);
				}
			});
			$.getJSON("./static/pipeline/DN600.json", "", function(data) {
				if (data != null && data.features != null) {
					_this.drawLines(data.features, "#8bb209", 5);
				}
			});
			$.getJSON("./static/pipeline/YDN150.json", "", function(data) {
				if (data != null && data.features != null) {
					_this.drawLines(data.features, "#8bb209", 4);
				}
			});
			$.getJSON("./static/pipeline/YDN600.json", "", function(data) {
				if (data != null && data.features != null) {
					_this.drawLines(data.features, "#8bb209", 5);
				}
			});

			// $.getJSON("view/assets/js/watermeter.json", "", function(data){
			// if(data != null && data.features != null) {
			// for (var index = 0; index < data.features.length; index ++){
			// var pts = wgs2bd(data.features[index].geometry.y,
			// data.features[index].geometry.x);;
			// var point = new BMap.Point(pts[1], pts[0]);
			// // var
			// pointLong=Number(data.features[index].geometry.x)+Number(0.01285);
			// // var
			// pointLat=Number(data.features[index].geometry.y)+Number(0.007);
			// //var point = new BMap.Point(pointLong,pointLat);
			// var icon = new BMap.Icon("view/assets/images/red_watermeter.png", new
			// BMap.Size(32, 32));
			// var marker = new BMap.Marker(point, { icon : icon });

			// var label = new BMap.Label("你好");
			// marker.setLabel(label);
			// map.addOverlay(marker);

			// }

			// }
			// });
		},

		drawLines: function(features, colors, width) {
			if (features != null && features.length > 0) {
				for (var i = 0; i < features.length; i++) {
					var feature = features[i];
					if (feature != null && feature.geometry != null &&
						feature.geometry.paths != null) {
						var points = new Array();
						for (var j = 0; j < feature.geometry.paths.length; j++) {
							var data = feature.geometry.paths[j];
							for (var m = 0; m < data.length; m++) {
								// 管线偏移量
								var pts = wgs2bd(data[m][1], data[m][0]);;
								var point = new BMap.Point(pts[1], pts[0]);
								points.push(point);
							}
						}
						this.drawLine(points, colors, width);
					}
				}
			}
		},

		drawLine: function(points, colors, width) {
			var lines = new BMap.Polyline(points, {
				strokeColor: colors,
				strokeWeight: width,
				strokeOpacity: 1
			});
			map.addOverlay(lines);
		},

		loadMonitorPoint: function() {
			let _this = this;
			$.getJSON("./static/pipeline/Monitor_bz.json", "", function(res) {
				$.each(res.points, function(index, item) {
					console.log(item);
					let pts = wgs2bd(Number(item.lat), Number(item.lon));
					let point = new BMap.Point(pts[1], pts[0]);
					let icon = new BMap.Icon("./static/images/pump.png", new BMap.Size(32, 32));
					var marker = new BMap.Marker(point, {
						icon: icon
					});
					//var label = new BMap.Label(item.name);
					marker.setLabel(item.name);
					map.addOverlay(marker);
					let data = {};
					data['title'] = item.name;
					data['lat'] = item.lat;
					data['lon'] = item.lon;
					data['url'] = item.imageUrl;
					data['addr'] = item.addr;
					data['control'] = item.control;
					data['img'] = item.img;
					marker.addEventListener("click", function() {
						let content = _this.getWindowInfo(data);
						//_this.openWindow(item.name, item.imageUrl, 1173, 719);
						_this.openInfo(content, point);
					});
				});
			})
		},
		
		openInfo: function(content, point) {
			var infoWindow = new BMap.InfoWindow(content);
			map.openInfoWindow(infoWindow, point);
			// map.centerAndZoom(point, 18);
		},
		
		openView : function(title){
			this.openWindow(title, "./static/images/nj1.png", 1173, 719);
		},
		
		openWindow: function(title, url, w, h) {
			if (title == null || title == '') {
				title = false;
			};
			if (url == null || url == '') {
				url = "404.html";
			};
			if (w == null || w == '') {
				w = ($(window).width() * 0.9);
			};
			if (h == null || h == '') {
				h = ($(window).height() - 50);
			};
			layer.open({
				type: 2,
				area: [w + 'px', h + 'px'],
				fix: false, //不固定
				maxmin: true,
				shadeClose: true,
				shade: 0.4,
				title: title,
				content: url
			});
		},
		
		
		openView1: function(title,img){
			this.openWindow1(title, "/waterSupply/static/pages/security/deviState_1.html?img="+img, 1173, 719);
		},
		
		openWindow1: function(title, url, w, h) {
			if (title == null || title == '') {
				title = false;
			};
			if (url == null || url == '') {
				url = "404.html";
			};
			if (w == null || w == '') {
				w = ($(window).width() * 0.9);
			};
			if (h == null || h == '') {
				h = ($(window).height() - 50);
			};
			layer.open({
				type: 2,
				area: [w + 'px', h + 'px'],
				fix: false, //不固定
				maxmin: true,
				shadeClose: true,
				shade: 0.4,
				title: title,
				content: url
			});
		},
		
		

		getWindowInfo: function(data) {
			var vContent = "<div class=\"container\">" +
				"        <div class=\"title\">" +
				"            <label><strong>" + data.title + "</strong></label>" +
				/*"             <a onclick=\"window.mapControl.getHistoryData(\'" + data.deviceSn + "\');\" data-toggle=\"modal\">详情>></a>" +*/
				"        </div>" +
				/*"        <div class=\"img_container\">" +
				"            <img src=\"view/assets/images/watermeterlocation/meter.jpg\" />" +
				"        </div>" +*/
				"        <div class=\"line\"></div>" +
				"            <div class=\"table_contianer\">" +
				"                <table class=\"table_context\">" +
				"                    <tr>" +
				"                        <td><strong>设备类型：</strong></td>" +
				"                        <td class=\"table_value\">水质改善无负压设备</td>" +
				"                    </tr>" +
				"                    <tr>" +
				"                        <td><strong>位置信息：</strong></td>" +
				"                        <td class=\"table_value\">"+ data.addr+"</td>" +
				"                    </tr>" +
				
				"                    <tr>" +
				"                        <td>经度：</td>" +
				"                        <td class=\"table_value\">"+ data.lon+ "</td>" +
				"                    </tr>" +
				"                    <tr>" +
				"                        <td>纬度：</td>" +
				"                        <td class=\"table_value\">"+ data.lat +"</td>" +
				"                    </tr>" +
				"                    <tr>" +
				"                        <td>压力：</td>" +
				"                        <td class=\"table_value\">60MPa</td>" +
				"                    </tr>" +
				"                    <tr>" +
				"                        <td>流量：</td>" +
				"                        <td class=\"table_value\">105m³/h</td>" +
				"                    </tr>" +
				"                    <tr>" +
				"                        <td>更新时间：</td>" +
				"                        <td class=\"table_value\">2019-11-10 08:20:54</td>" +
				"                    </tr>" +
				"                    <tr>" +
				"                        <td><a onclick=\"mapCtrl.openView(\'" + data.title + "\');\" style='color:blue'>泵房全景视图>></a></td>" +				                  
				"                    </tr>" +
				"                    <tr>" +
				"                        <td><a onclick=\"mapCtrl.openView1(\'" +data.title + "\', \'" +data.img + "\');\" style='color:blue'  >监控信息>></a></td>" +				                  
				"                    </tr>" +
				
				"                </table>" +
				"            </div>" +
				"        </div>";
			return vContent;
		}
	};
	exports("mapControl", mapControl);
})
